<div class="home">
    <nz-layout style="height: 100%; width: 100%">

        <!-- 左侧tree -->
        <nz-sider nzCollapsible [(nzCollapsed)]="isCollapsed" [nzTrigger]="null">

            <div class="logo"> </div>

            <ul nz-menu [nzTheme]="'dark'" [nzMode]="isCollapsed?'vertical':'inline'" >


              <li nz-submenu *ngFor="let menu of menuList | async">
                <span title><i class="anticon anticon-user"></i><span class="nav-text">User</span></span>
                <ul>
                  <li nz-menu-item [routerLink]="['./userList']">Tom</li>
                  <li nz-menu-item>{{menu.menuName}}</li>
                  <li nz-menu-item>{{menu.updateTime}}</li>
                </ul>
              </li>
              <!--<li nz-submenu>-->
                <!--<span title><i class="anticon anticon-team"></i><span class="nav-text">Team</span></span>-->
                <!--<ul>-->
                  <!--<li nz-menu-item>Team 1</li>-->
                  <!--<li nz-menu-item>Team 2</li>-->
                <!--</ul>-->
              <!--</li>-->
              <!--<li nz-menu-item><span><i class="anticon anticon-file"></i><span class="nav-text">File</span></span>-->
              <!--</li>-->
            </ul>

        </nz-sider>

        <nz-layout style="height: 100%; width: 100%">

            <!-- 头部 -->
            <nz-header style="background: #fff; padding:0;">
                <i class="anticon trigger" [class.anticon-menu-fold]="!isCollapsed" [class.anticon-menu-unfold]="isCollapsed" (click)="isCollapsed=!isCollapsed"></i>
            </nz-header>

            <!-- 内容 -->
            <nz-content style="margin:0 16px;">

                <nz-breadcrumb style="margin:12px 0;">
                    <nz-breadcrumb-item>User</nz-breadcrumb-item>
                    <nz-breadcrumb-item>Bill</nz-breadcrumb-item>
                </nz-breadcrumb>

                <div class="main-content" style="padding:24px; background: #fff; min-height: 360px;">
                    <router-outlet></router-outlet>
                </div>

            </nz-content>

            <!-- <nz-footer style="text-align: center;">Ant Design ©2017 Implement By Angular</nz-footer> -->
        </nz-layout>

    </nz-layout>

</div>
